
<!DOCTYPE HTML>
<html lang="en">
	<head>
		<meta charset="utf-8">
		<title>Tutorial: NodeList Events</title>
		<link rel="stylesheet" href="style.css" media="screen">
		<link rel="stylesheet" href="css/demo.css" media="screen">
	</head>
	<body>
		<h1>Tutorial: NodeList Events</h1>

		<button class="hookUp demoBtn">By Class!</button>
		<button id="btnSed">By Id!</button>
		
		<input type="button" value="By Tag"></input>
		
		<!-- load dojo and provide config via data attribute -->
		<script src="js/dojo/dojo.js" data-dojo-config="async: true"></script>
		<script>
			// Wait for the DOM to be ready before working with it
			require(["dojo/query", "dojo/domReady!"], function(query) {
			
				query(".hookUp").on("click", function(e){
					alert("click by " + e.target.innerText);
				});
			
				query("#btnSed").on("click", function(e){
					alert("click by " + e.target.innerText);
				});
				
				query("input").on("click", function(e){
					alert("click by " + e.target.value);
				});
			});
		</script>
	</body>
</html>